$(document).ready(function () {
    var activePos = $('.tabs-header .active').position();

    function changePos() {
        activePos = $('.tabs-header .active').position();

        $('.border').stop().css({
            left: activePos.left,
            width: $('.tabs-header .active').width(),
        });
        }
    changePos();
    var tabHeight = $('.tab.active').height();

    function animateTabHeight() {
        tabHeight = $('.tab.active').height();
        $('.tabs-content').stop().css({height: tabHeight + 'px'});
    }

    animateTabHeight();


    $('.tabs-header a').on('click', function (e) {
        e.preventDefault();
        var tabId = $(this).attr('tab-id');
        $('.tabs-header a').stop().parent().removeClass('active');
        $(this).stop().parent().addClass('active');
        changePos();
        tabCurrentItem = tabItems.filter('.active');
        $('.tab').stop().fadeOut(300, function () {
            $(this).removeClass('active');
        }).hide();
        $('.tab[tab-id="' + tabId + '"]').stop().fadeIn(300, function () {
            $(this).addClass('active');
            animateTabHeight();
        });
    });
    var tabItems = $('.tabs-header ul li');

});